<%--
  Created by IntelliJ IDEA.
  User: ASUS
  Date: 2020/12/3
  Time: 19:25
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<div class="offcanvas-minicart-wrapper">
    <div class="minicart-inner">
        <div class="offcanvas-overlay"></div>
        <div class="minicart-inner-content">
            <div class="minicart-close">
                <i class="lnr lnr-cross"></i>
            </div>
            <%--            <c:if test="${empty sessionScope.cart.items}">--%>
            <%--                &lt;%&ndash;购物车为空的输出&ndash;%&gt;--%>
            <%--                <span id="cartTotalCount"> </span>--%>
            <%--                <div>--%>
            <%--                    <span style="color: red" id="cartLastName">当前购物车为空</span>--%>
            <%--                </div>--%>
            <%--            </c:if>--%>
            <%--            <c:if test="${not empty sessionScope.cart.items}">--%>
            <%--                &lt;%&ndash;购物车非空的输出&ndash;%&gt;--%>
            <%--                <span id="cartTotalCount">您的购物车中有 ${sessionScope.cart.totalCount} 件商品</span>--%>
            <%--                <div>--%>
            <%--                    您刚刚将<span style="color: red" id="cartLastName">${sessionScope.lastName}</span>加入到了购物车中--%>
            <%--                </div>--%>
            <%--            </c:if>--%>
            <c:if test="${empty sessionScope.cart.items}">
                <span id="cartTotalCount"> </span>
                <div>
                    <span style="color: red" id="cartLastName">当前购物车为空</span>
                </div>
            </c:if>
            <c:if test="${not empty sessionScope.cart.items}">
                <div class="minicart-content-box">
                    <div class="minicart-item-wrapper">
                        <ul>
                            <c:forEach items="${sessionScope.cart.items}" var="cart">
                            <li class="minicart-item">
                                <div class="minicart-thumb">
                                    <a href="#">
                                        <img src="${pageContext.request.contextPath}/${cart.value.img_path}" alt="product">
                                    </a>
                                </div>
                                <div class="minicart-content">
                                    <h3 class="product-name">
                                        <a href="product-details.html">${cart.value.name}</a>
                                    </h3>
                                    <p>
                                        <span class="cart-quantity">${cart.value.count}<strong>&times;</strong></span>
                                        <span class="cart-price">${cart.value.price}</span>
                                    </p>
                                </div>
                                <a style="margin-top: 30px" href="cartServlet?action=deleteItem&id=${cart.value.id}" class="minicart-remove" ><i class="lnr lnr-cross"></i></a>
                            </li>
                            </c:forEach>
                        </ul>
                    </div>

                    <div class="minicart-pricing-box">
                        <ul>
                            <li>
                                <span>数量</span>
                                <span><strong>${sessionScope.cart.totalCount}</strong></span>
                            </li>
                            <li class="total">
                                <span>共计</span>
                                <span><strong>￥${sessionScope.cart.totalPrice}</strong></span>
                            </li>
                        </ul>
                    </div>

                    <div class="minicart-button">
                        <a href="${pageContext.request.contextPath}/pages/Floda/order_list.jsp"><i class="fa fa-shopping-cart"></i>结算</a>
                    </div>
                </div>
            </c:if>
        </div>
    </div>
</div>
